<% include '/WEB-INF/includes/header.gtpl' %>

<div id="main" >
    
    <div id="categorias" class="clearfix">
    <div class="container_16 clearfix" style="padding-top:30px;">
    <div class="grid_13">

        <h1>Reserva de plaza</h1>
        
        <form id="formulario" method="POST" action="/inscrito">
        <input type="hidden" name="action" value="create" />
               
               
        <fieldset>
        <p>inscripcion</p>
        
        <div class="campo">
        <label class="etiqueta" for="nombre">Nombre</label>
        <input type="text" id="nombre" name="nombre"/>
        <span class="mensaje"></span>
        </div>
        
        <div class="campo">
        <label class="etiqueta" for="apellidos">Apellidos</label>
        <input type="text" id="apellidos" name="apellidos"/>
        <span class="mensaje"></span>
        </div>
        
        <div class="campo">
        <label class="etiqueta" for="correo">Correo</label>
        <input type="text" id="correo" name="correo"/>
        <span class="mensaje"></span>
        </div>
        
        
        <div class="campo">
        <label class="etiqueta" for="telefono">Teléfono</label>
        <input type="text" id="telefono" name="telefono"/>
        <span class="mensaje"></span>
        </div>
        
        
        
        
        <div class="campo">
        <label class="etiqueta" for="actividad">Actividad</label>
        <% include '/WEB-INF/groovy/ActividadController.groovy?action=listado' %>
        <span class="mensaje"></span>
        </div>
        
        <div class="campo">
        <label class="etiqueta" for="numeroPlazas">Nº Plazas</label>
        <input type="text" id="numeroPlazas" name="numeroPlazas"/>
        <span class="mensaje"></span>
        </div>        
        
        
          <div class="controls">
          
               
              <!--<a href="/" id="cancel" class="submit" name="cancel">Cancela</a>-->      
              <input id="submit" class="submit" name="submit" type="submit" 
                  value="Enviar"/>
              
                  
            </div>
            
        
        </fieldset>
        
        </form>
</div>
</div>
</div>
</div>


<% include '/WEB-INF/includes/footer-sinlateral.gtpl' %>


<script src="js/jquery-1.4.1.js" type="text/javascript"></script>
<script src="js/jquery.validate.js" type="text/javascript"></script>


<script type="text/javascript">
jQuery(function() {

	
    var validator = jQuery("#formulario").validate({
        rules: {
            nombre: {
              required:true,	
              maxlength:250
            },
            apellidos: {
              required:true,    
              maxlength:250
            },
            
            correo: {
              required:true,    
              maxlength:250
            },    
            
            telefono: {
              required:true,    
              maxlength:10
            },                    
            actividad: "required",
            numeroPlazas: "required"
        },
        messages: {

        	nombre: {
        	   required:"Este campo e requirido",
            },
            
            apellidos: {
               required:"Este campo e requirido",
            } ,
            
            correo: {
               required:"Este campo e requirido",
            },
            
            telefono: {
               required:"Este campo e requirido",
            },
            actividad: {
               required:"Este campo e requirido",
            },
            numeroPlazas: {
               required:"Este campo e requirido",
            }
            
            
            
        },
        // the errorPlacement has to take the table layout into account
        errorPlacement: function(error, element) {
            if ( element.is(":radio") )
                error.appendTo( element.parent().next().next() );
            else if ( element.is(":checkbox") )
                error.appendTo ( element.next() );
            else
                //error.appendTo( element.parent().next() );
                error.appendTo( element.next());
        },
        
        // set this class to error-labels to indicate valid fields
        success: function(label) {
            // set &nbsp; as text for IE
            label.html("&nbsp;").addClass("checked");
        }
    });
    
}); 
    
    
</script>   



<% include '/WEB-INF/includes/fin.gtpl' %>

